<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="baidu-site-verification" content="code-5VrlFsNM5b" />
    <title>找回密码</title>
    <link rel="stylesheet" type="text/css" href="__CSS__/api.css"/>
    <style>
        html,body{
            width:100%;
            height:100%;
        }
        body{
            background:rgba(0,0,0,0.4);

        }
        .box{
            width:380px;
            height:466px;
            background:#fff;
            border-radius:4px;
            position: absolute;
            top:0;
            left:0;
            bottom:0;
            right:0;
            margin:auto;
            padding:0 45px 0 35px;
            box-sizing: border-box;
        }
        .title{
            font-size:20px;
            font-weight:600;
            color:#101C37;
            margin-top:32px;
            margin-bottom:60px;
        }
        .arrow{
            width:16px;
            height:16px;
            position: absolute;
            top:24px;
            right:20px;
            cursor: pointer;
        }
        input[type="text"],input[type="password"]{
            width:100%;
            height:50px;

            border:1px solid #DBDBDB;
            border-radius:2px;
            padding:0 16px;
            box-sizing: border-box;
            font-size:14px;
            color:#333;
            outline: none;
        }
        input[type="text"]::-webkit-input-placeholder,input[type="password"]::-webkit-input-placeholder{
            font-size:14px;
            color:#bbb;
        }
        .jianju{
            margin-bottom:20px;
        }
        .inputBox{
            width:100%;
            height:50px;
            border:1px solid #DBDBDB;
            border-radius:2px;
            padding:0 16px;
            box-sizing: border-box;
            margin-bottom:20px;
            align-items: center;
        }
        .inputBox input[type="text"]{
            border:0;
            border-radius:0;
            height:100%;
            padding:0;
        }
        .getCode{
            color:#3463E6;
            font-size:14px;
        }

        .btn{
            width:100%;
            height:50px;
            line-height: 50px;
            text-align: center;
            font-size:16px;
            color:#fff;
            font-family:PingFangSC-Medium;
            font-weight:500;
            background: #3463E6;
            border-radius:4px;
            margin-top:50px;
            cursor: pointer;
        }
        .flex-wrap {
            display: -webkit-box;
            display: box;
            display: -webkit-flex;
            display: flex;
        }
        .flex-con {
            -webkit-box-flex: 1;
            -webkit-flex: 1;
            flex: 1;
        }
    </style>
    <style>
        .code_gray{
            color:#ccc;
        }
    </style>
</head>
<body>
<div class="box">
    <div class="title">找回密码</div>
    <img src="__IMG__/arrow.png" alt="" class="arrow" onclick="history.go(-1);">
    <input type="text" maxlength="11" id="phone1" placeholder="请输入手机号" class="jianju">
    <div class="inputBox flex-wrap">
        <input type="text" maxlength="4" id="code" placeholder="请输入验证码" class="flex-con">
        <div class="getCode" onclick="sendcode(this);">获取验证码</div>
    </div>
    <input type="password" id="pwd1" minlength="6" maxlength="20" placeholder="请输入新密码">

    <div class="btn" id="register">立即找回密码</div>
</div>
<div style="width:100%;margin:0 auto; padding:20px 0;background-color: #fff;position: absolute;bottom: 0;text-align: center;color: #939393;">
    <img src="__IMG__/aaa.png" style="float:right;margin-right: 100px;" height="80" />
    <br/>
    置家优选隶属于北京顺合科技服务有限公司，置家优选是一款专业的房源信息发布平台。一站式家居服务平台，让用户享受优质的居住服务体验！
    <br/>
    地址：北京市朝阳区广顺北大街33号院1号楼1101室
    <a target="_blank" href=" " style="display:inline-block;text-decoration:none;height:20px;line-height:20px;"><img src="__IMG__/gongan.png" style="float:left;"/><p style="float:left;height:20px;line-height:20px;margin: 3px 0px 0px 5px; color:#939393;">京公网安备 11010502042473号</p></a>
</div>
</body>
<script src="/static/admin/js/jquery.min.js"></script>
<script type="text/javascript" src="__JS__/api.js"></script>
<script>

    $('#register').on('click',function (e) {
        var _phone = $('#phone1'),
            _pwd1 = $('#pwd1'),
            _code = $('#code'),
            p = 0,
            w1 = 0,
            c = 0;
        if(_phone.val() == ""){
            alert('请输入手机号');
            return;
        }else{
            var pattern = /^1[3456789]\d{9}$/;
            if(!pattern.test(_phone.val())){
                alert('请输入正确的手机号');
                return;
            }else{
                p = 1;
            }
        }
        if(_code.val() == ""){
            alert('请输入验证码');
            return;
        }else{
            c = 1;
        }
        if(_pwd1.val() == ""){
            alert('请输入新密码');
            return;
        }else{
            var pattern = /^(?![\d]+$)(?![a-zA-Z]+$)(?![^\da-zA-Z]+$).{6,20}$/;
//            if(!pattern.test(_pwd1.val())){
            if(_pwd1.val().length < 6 || _pwd1.val().length > 20){
//                alert('密码由6-20位数字/字母/常用符号组成');
                alert('密码长度应在6-20位之间');
                return;
            }else{
                w1 = 1;
            }
        }
        if(p && w1 && c){
            $(this).attr('disabled','disabled').html('提交中...');
            $.ajax({
                url:"{:url('home/Login/resetPwd')}",
                type:'post',
                data:{phone:_phone.val(),code:_code.val(),pwd:_pwd1.val()},
                dataType:'json',
                success:function(res){
                    if(res.code == 200){
                        window.location.href=res.url;
                        return;
                    }else{
                        $('#register').removeAttr('disabled').html('立即找回密码');
                        alert(res.msg);
                        return;
                    }
                }
            })
        }
    })
    //发送验证码
    function sendcode(o){
        var obj= $(o);
        obj.removeAttr('onclick');
        if($('#phone1').val() == ""){
            obj.attr("onclick",'sendcode(this)');
            alert('请输入手机号');
            return;
        }else{
            var pattern = /^1[3456789]\d{9}$/;
            if(!pattern.test($('#phone1').val())){
                obj.attr("onclick",'sendcode(this)');
                alert('请输入正确的手机号');
                return;
            }else{
                $.ajax({
                    url:"{:url('home/Login/sendCode')}",
                    type:"post",
                    dataType:"json",
                    data:{type:1,phone:$('#phone1').val()},
                    success:function(res){
                        if(res.code == 200){
                            settime(obj);
                            return;
                        }else{
                            obj.attr("onclick",'sendcode(this)');
                            alert(res.msg);
                            return;
                        }
                    }
                })

            }
        }
    }
    var countdown=60;
    function settime(obj) {
        obj.addClass('code_gray');
        if (countdown == 0) {
            obj.attr("onclick",'sendcode(this)');
            obj.html("获取验证码");
            obj.removeClass('code_gray');
            countdown = 60;
            return;
        } else {
            obj.html("重新发送(" + countdown + ")");
            countdown--;
        }
        setTimeout(function() {
            settime(obj)
        },1000)
    }
</script>
</html>
